layui.use(['element', 'jquery', 'layer'], function () {
    let element = layui.element;
    let layer = layui.layer;
    let $ = layui.jquery;

    // 单击菜单按钮
    $('.subMenu').on('click', function () {
        // 获取选项卡的相关信息
        let tabTitle = $(this).text();
        let tabId = $(this).prop("id");
        let pageUrl = $(this).children('a').data('url');

        // 如果不存在选项卡，则添加一个新的选项卡
        if($('.layui-tab-title li[lay-id="'+tabId+'"]').length == 0){
            element.tabAdd('demo', {
                title: tabTitle,
                content: '<iframe src="' + pageUrl + '" class="layadmin-iframe" frameborder="no" border="0" allowtransparency="yes"></iframe>',
                id: tabId
            });
        }
        // 切换到指定 ID 的选项卡
        element.tabChange('demo', tabId);
    });

    const topTool1 = document.getElementById('sjfx');
    const topTool2 = document.getElementById('spgl');
    const topTool3 = document.getElementById('kcgl');
    const topTool4 = document.getElementById('xtgl');
    const tooltip = document.getElementById('tooltip');
    topTool1.addEventListener("mouseenter",function (event){
        tooltip.textContent = '数据分析';
        tooltip.style.display = 'block';
        tooltip.style.left = event.pageX + 'px';
        tooltip.style.top = event.pageY + 'px';
    })

    topTool2.addEventListener('mouseleave', function() {
        tooltip.style.display = 'none';
    });

    topTool2.addEventListener("mouseenter",function (event){
        tooltip.textContent = '商品管理';
        tooltip.style.display = 'block';
        tooltip.style.left = event.pageX + 'px';
        tooltip.style.top = event.pageY + 'px';
    })

    topTool1.addEventListener('mouseleave', function() {
        tooltip.style.display = 'none';
    });

    topTool3.addEventListener("mouseenter",function (event){
        tooltip.textContent = '库存管理';
        tooltip.style.display = 'block';
        tooltip.style.left = event.pageX + 'px';
        tooltip.style.top = event.pageY + 'px';
    })

    topTool3.addEventListener('mouseleave', function() {
        tooltip.style.display = 'none';
    });

    topTool4.addEventListener("mouseenter",function (event){
        tooltip.textContent = '系统管理';
        tooltip.style.display = 'block';
        tooltip.style.left = event.pageX + 'px';
        tooltip.style.top = event.pageY + 'px';
    })

    topTool4.addEventListener('mouseleave', function() {
        tooltip.style.display = 'none';
    });
});